<template>
    <div class="app-container">
      	<el-tabs v-model="tabIndex" stretch>
          <el-tab-pane label="银行受理信息" name="0">
            <el-card class="filter-container" shadow="never">
              <dy-slxx v-model="slxxform"></dy-slxx>
              <el-button @click="tabIndex = '1'">下一步</el-button>
            </el-card>
          </el-tab-pane>

          <el-tab-pane label="抵押权人信息" name="1">
            <el-card class="filter-container" shadow="never">
              <dyqrxx v-model="dyqrform"></dyqrxx>
              <el-button @click="tabIndex = '0'">上一步</el-button>
              <el-button @click="tabIndex = '2'">下一步</el-button>
            </el-card>
          </el-tab-pane>

          <el-tab-pane label="抵押不动产信息" name="2">
            <el-card class="filter-container" shadow="never">
              <dybdcxx v-model="dybdcxxform"></dybdcxx>
              <el-button @click="tabIndex = '1'">上一步</el-button>
              <el-button @click="tabIndex = '3'">下一步</el-button>
            </el-card>
          </el-tab-pane>

          <el-tab-pane label="抵押信息" name="3">
            <el-card class="filter-container" shadow="never">
              <dyxx v-model="dyxxform"></dyxx>
              <el-button @click="tabIndex = '2'">上一步</el-button>
              <el-button @click="tabIndex = '4'">下一步</el-button>
            </el-card>
          </el-tab-pane>

          <el-tab-pane label="抵押材料信息" name="4">
            <el-card class="filter-container" shadow="never">
              <dy-slxx v-model="dyxxform"></dy-slxx>
              <el-button @click="tabIndex = '3'">上一步</el-button>
            </el-card>
          </el-tab-pane>

        </el-tabs>
    </div>
</template>

<script>
  import DySlxx from './components/DySlxx'
  import Dyqrxx from './components/Dyqrxx'
  import Dybdcxx from './components/Dybdcxx'
  import Dyxx from './components/Dyxx'


export default {
    components: {
      DySlxx,
      Dyqrxx,
      Dybdcxx,
      Dyxx
    },
    data() {
        return {
          tabIndex: '0', //tab下标

          // 受理信息
          slxxform: {
            ywslh: '',
            djlx: '',
            qxdm: '',
            dxlxdh: '',
            zxdh: '',
            dxlxr: '',
            slr: '',
            slsj: '',
          },

          // 抵押权人
          dyqrform: {
            frmc: '',
            frdh: '',
            frzjlx: '',
            frzjh: '',
            dlrmc: '',
            dlrdh: '',
            dlrzjzl: '',
            dlrzjh: '',
            qlrlx: '',
            qlrdh: '',
            qlrzjlx: '',
            zjh: '',
            txdz: '',
          },

          /** 抵押不动产信息 */
          dybdcxxform: {
            sfzh: '',    // 身份证号（查询条件）
            bdcqzh: '',  // 不动产权证号（查询条件）

            yywbh: '',
            zl: '',
            bdcdyh: '',
            fwbm: '',
            
            /** 抵押人信息 */
            dyrxx: [{
              dlrmc: '',
              dlrdh: '',
              dlrzjhm: '',
              qlrmc: '',
              zjlx: '',
              zjhm: '',
              xb: '',
              dwxz: '',
              gj: '',
              gyqk: '',
              qlbl: '',
            }],

          },

          // 抵押信息
          dyxxform: {
            dyhth: '',
            jkhth: '',
            dyfs: '',
            dysxh: '',
            dypgje: '',
            bdbzzqse: '',
            zgzqse: '',
            zwr: '',
            dyfw: '',
            dklx: '',
            zgzqqdss: '',
            bdclx: '',
            dyqsrq: null,
            dyjzrq: null,
            dyfj: '',
          },          
        };
    },
    computed: {},
    watch: {},
    methods: {},
    created() {},
    mounted() {},
    beforeCreate() {},
    beforeMount() {},
    beforeUpdate() {},
    updated() {},
    beforeDestroy() {},
    destroyed() {},
    activated() {},
    }
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类

</style>